<%--
  Created by IntelliJ IDEA.
  User: zer
  Date: 2019/10/5
  Time: 17:54
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="s" uri="/struts-tags" %>
<html>
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width, initial-scale=0.58,maximum-scale=1.0, user-scalable=no">

    <link rel="stylesheet" href="css/bootstrap-responsive.min.css"/>
    <link rel="stylesheet" href="css/bootstrap.css"/>
    <link rel="stylesheet" href="css/style.css"/>
    <link rel="stylesheet" href="css/ySelect.css">
    <link rel="stylesheet" type="text/css"
          href="http://cdn.bootcss.com/font-awesome/4.6.0/css/font-awesome.min.css">
    <link rel="stylesheet" href="css/url.css" />

    <script type="text/javascript" src="js/jquery-2.1.0.js"></script>
    <script type="text/javascript" src="js/bootstrap.js"></script>
    <script rel="script" src="js/ySelect.js"></script>

    <script type="text/javascript" src="js/popper.js"></script>
    <script type="text/javascript" src="js/bootbox.js"></script>
    <script type="text/javascript" src="js/bootbox.locales.js"></script>

    <title>智慧爬虫</title>
    <style type="text/css">
        body {
            background: url(img/背景.png) repeat 0 0;
            height: 100%;
        }
    </style>

    <s:debug></s:debug>
</head>
<body>
<div>
    <div class="container">
        <div class="row">
            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12" id="header">
                <img src="img/logo.png" style="margin-top: -40px;"/>
            </div>
        </div>
        <div class="row banxin2">

            <div id="list2">
                <%--提交解析地址的表单--%>
                <form id="urlForm" method="post"
                      action="${pageContext.request.contextPath}/CrawlerAction_analysis">
                    <span >网址:</span>
                    <input id="url" name="url" type="text" placeholder="输入链接地址"/>
                    <input id="submitUrl" type="submit"  value="解析"/>
                </form>
                <hr >

                <%--如果需要登录才能访问到的链接地址,就先使用这个表单模拟登录,获得登录的cookie--%>
                <form id="loginForm" method="post"
                      action="${pageContext.request.contextPath}/CrawlerAction_login">
                    <input id="urlCopy" name="url" type="hidden" value=""/>
                    <div>
                        <span >用户名：</span>
                        <input id="username" name="username" type="text" placeholder="用户名"/>
                    </div>
                    <div style="margin-top: 5px">
                        <span >密&nbsp&nbsp&nbsp码：</span>
                        <input id="password" name="password" type="text" placeholder="密码"/>
                        <input id="submitForm" type="button"  value="模拟登录"/>
                    </div>

                </form>
                <hr >

                <%--手动填写Cookie信息进行模拟登录--%>
                <form id="cookieForm" method="post"
                      action="${pageContext.request.contextPath}/CrawlerAction_addCookies" >
                    <table id="cookieTable">
                        <tr id="listadd">
                            <td>
                                <span >name:</span>
                                <input name="name" type="text" value=""/>
                            </td>
                            <td>
                                <span >value:</span>
                                <input name="value" type="text" value=""/>
                            </td>
                            <td>
                                <button id="addinput" style="display: contents" > <img  src="img/add.png" style="width: 25px;height: 25px;border-radius:50%;" /> </button>
                            </td>
                        </tr>
                    </table>

                    <input id="cookie" type="button"  value="手动添加cookie"/>
                </form>


            </div>
        </div>

        <div class="row banxin2">
            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                <div id='insign' style="float: left; margin-top: 15px;">
                    <label id="tip" class="text-explain">欢迎使用智慧云打印</label>
                    <br/>
                    <label class="text-explain">
                        请输入网页的网址。如网页需要登录，请输入账号及密码；
                        若网页要需要验证码，具体如该网页所示：<a href="introduce.jsp">请按这里</a>
                    </label>
                </div>
            </div>
        </div>
    </div>
</div>
</body>
<script>
    $(function(){
        $("#addinput").click(function(){

            $("#cookieTable").append(
                ' <tr><td> <span> name: </span> <input name="name" type="text" value=""/> </td> <td> <span>value:</span> <input name="value" type="text" value=""/> </td></tr>'
            );

            event.preventDefault();
        })
    })

</script>
<script>
    $("#cookie").click(function () {

        alert("进入了方法!");
        var data = new Array();

        var tr = $("#cookieTable tr");

        alert(tr.length);

        $.each(tr, function (index, value) {
            // alert($(value).html());
            var td = $(value).children();
            var cookie = new Object();
            cookie.name = td.eq(0).find("input").val();
            cookie.value = td.eq(1).find("input").val();
            data[index] = cookie;
        });
        // alert(JSON.stringify(data));
        var cookiesJson = JSON.stringify(data);
        $.ajax({
            "type": "post",
            "url": "${pageContext.request.contextPath}/CrawlerAction_addCookies",
            "data": {"cookies":cookiesJson},
            "async": true,
            "error": function (request) {  //失败的话
                alert("cookie录入失败:" + request);
            },

            "success": function (data) {  //成功
                //
                bootbox.alert(data);
            }
        });

    });

    /*$("#submitUrl").click(function () {
        //把urlForm中的链接地址复制过来
        var url = $("#url").val();

        //1.弹出具体解析项的表单
        bootbox.dialog({
            title : "解析项勾选",
            message : '<form id="loginForm" method="post" action="${pageContext.request.contextPath}/CrawlerNewAction_login">\
            <input id="urlCopy" name="url" type="hidden" value='+url+'/>\
            </form>',
        })
        //2.提交具体解析
    })*/

    $("#submitForm").click(function () {
        //可以调用方法

        //1.把urlForm中的链接地址复制到模拟登录的表单中
        $("#urlCopy").val($("#url").val());
        //2.同步提交表单,在模拟登录完成之前不能进行下一步操作
        $.ajax({
            "type": "post",
            "url": "${pageContext.request.contextPath}/CrawlerAction_login",
            "data": $("#loginForm").serialize(),
            "async": false,
            "error": function (request) {  //失败的话

                alert("提交失败 error:" + request);

            },

            "success": function (data) {  //成功
                //返回的是获取到的cookie
                bootbox.alert(data);
            }
        })
    })

</script>

</html>
